@{   
    
    Layout = "~/Views/Shared/_LayoutJtable.cshtml";     

}
@{ViewBag.Title = "Gestione Datos";}

<div class="filtering"><form>
<label>Indroduzca texto para filtrar: <input type="text" name="filter" id="filter" /></label>
<button type="submit" id="LoadRecordsButton" class="button medium green">Filtrar Datos</button>
</form></div>
<div id="MyTableContainer"></div>
<script type="text/javascript">
    $(document).ready(function () {
        $('#MyTableContainer').jtable({
            title: 'SesionUsuario',
            paging: true,
            pageSize: 50,
            sorting: true,
            defaultSorting: 'Id ASC',
            actions: {
             listAction: '@Url.Action("JSONPagedListByFilter")'             
         },
         fields:
         {
             Id: {
                 key: true,
                 create: false,
                 edit: false,
                 list: false
             }
             ,
             FechaPrimerAcceso: {
                 title: 'FechaPrimerAcceso',
                 create: true,
                 edit: true,
                 list: true,
                 type: 'date',
                 displayFormat: 'dd/mm/yy',
                 sorting: false
             }
             ,
             FechaUltimoAcceso: {
                 title: 'FechaUltimoAcceso',
                 create: false,
                 edit: true,
                 list: false,
                 type: 'date',
                 displayFormat: 'dd/mm/yy',
                 sorting: false
             }
             ,
             IP: {
                 title: 'IP',
                 create: true,
                 edit: true,
                 list: true,
                 sorting: false
             }
             ,
             Navegador: {
                 title: 'Navegador',
                 create: true,
                 edit: true,
                 list: true,
                 sorting: false
             }
             ,
             LlaveSesion: {
                 title: 'LlaveSesion',
                 create: true,
                 edit: true,
                 list: true,
                 sorting: false
             }
             ,
             UsuarioId_FK: {
                 title: 'Usuario',
                 create: true,
                 edit: true,
                 list: true,
                 options: '@Url.Action("../Usuario/JSONGetElementsForDropDownList")'
             },


             DatosHistorialSesion: {
                 title: '',
                 width: '1%',
                 sorting: false,
                 edit: false,
                 create: false,
                 listClass: 'child-opener-image-column',
                 display: function (sessionData) {
                     var $img = $('<img class="child-opener-image" with="20" height="20" src="../../Content/images/menu/report.png" title="Revisar Accesos" />');
                     //Open child table when user clicks the image
                     $img.click(function () {
                         $('#MyTableContainer').jtable('openChildTable',
                                    $img.closest('tr'),
                                    {
                                        title: 'Historial Session',
                                        actions: {
                                            listAction: '../HistoriaSesion/HistorialBySesionId?Id=' + sessionData.record.Id                                            
                                        },
                                        fields: {
                                            SesionUsuarioId_FK: {
                                                type: 'hidden',
                                                defaultValue: sessionData.record.Id
                                            },

                                            Id: {
                                                key: true,
                                                create: false,
                                                edit: false,
                                                list: false
                                            }
                                             ,
                                            Descripcion: {
                                                title: 'Descripcion',
                                                create: true,
                                                edit: true,
                                                list: true,
                                                sorting: false
                                            }
                                             ,
                                            URL: {
                                                title: 'URL',
                                                create: true,
                                                edit: true,
                                                list: true,
                                                sorting: false
                                            }
                                             ,
                                            FechaAcceso: {
                                                title: 'FechaAcceso',
                                                create: true,
                                                edit: true,
                                                list: true,
                                                type: 'date',
                                                displayFormat: 'dd/mm/yy',
                                                sorting: false
                                            }
                                             ,
                                            Accion: {
                                                title: 'Accion',
                                                create: true,
                                                edit: true,
                                                list: true,
                                                sorting: false
                                            }
                                             ,
                                            Controlador: {
                                                title: 'Controlador',
                                                create: true,
                                                edit: true,
                                                list: true,
                                                sorting: false
                                            }
                                             ,
                                            Parametros: {
                                                title: 'Parametros',
                                                create: true,
                                                edit: true,
                                                list: true,
                                                width: '10%'
                                            }

                                        }
                                    }, function (data) { //opened handler
                                        data.childTable.jtable('load');
                                    });
                     });
                     //Return image to show on the person row
                     return $img;
                 }
             }







         },
         formCreated: function (event, data) { data.form.validationEngine(); },
         formSubmitting: function (event, data) { return data.form.validationEngine('validate'); },
         formClosed: function (event, data) { data.form.validationEngine('hide'); data.form.validationEngine('detach'); }
     });
         $('#LoadRecordsButton').click(function (e) { e.preventDefault(); $('#MyTableContainer').jtable('load', { filter: $('#filter').val() }); });
         $('#LoadRecordsButton').click();
     });
</script>


